<!DOCTYPE html>
<html lang="zh" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('商家详情')"/>
</head>
<!--<body class="gray-bg">-->

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>资料信息</title>
    <style>
        html,
        body {
            width: 100%;
            height: 100%;
            padding: 0;
            margin: 0;
        }

        .content {
            padding: 0 50px;
        }

        .small-title {
            display: flex;
            align-items: center;
            margin: 8px 0 20px;
        }

        .small-title > div {
            width: 4px;
            height: 24px;
            background-color: #4787F8;
            border-radius: 0 px 2px 2px 0px;
            margin-right: 12px;
        }

        .children {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            margin-bottom: 60px;
        }

        .title {
            display: flex;
            align-items: center;
        }

        .title > span {
            font-size: 24px;
            color: #333;
            font-weight: bold;
        }

        .info {
            margin-top: 20px;
            margin-left: 400px;
        }

        .img {
            margin-right: 30px;
            width: 72px;
            height: 72px;
            border-radius: 8px;
        }

        .name {
            color: #333;
            font-size: 14px;
        }

        .num {
            font-weight: bold;
            color: #4787F8;
            font-size: 14px;
        }

        .down {
            margin-left: 16px;
            text-decoration: underline;
        }

        .time {
            margin-left: 160px;
            font-size: 14px;
            color: #999;
        }

        .flex-center {
            display: flex;
            align-items: center;
            flex-direction: row;
        }

        .flex-colunm {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .red {
            font-size: 14px;
            color: #EF2A2A;
        }

        .photo {
            width: 196px;
            height: 146px;
            border-radius: 6px;
            margin: 16px 0;
        }

        .k-height {
            height: 16px;
        }

        .children > .flex-colunm {
            margin-right: 120px;
        }

        .front {
            margin-right: 60px;
        }

        .id {
            margin-left: -16px;
        }

        .all {
            margin-bottom: 20px;
        }

        .left {
            text-align: right;
            width: 150px;
        }

        .right {
            margin-left: 20px;
            width: 380px;
        }

        textarea {
            resize: none;
        }

        .flex-center-between {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .closed,
        .refresh {
            width: 80px;
            height: 30px;
            border: 0;
            background-color: #4787F8;
            border-radius: 20px;
            color: #fff;
        }

        .closed {
            background-color: red;
            margin-right: 40px;
        }

        .info-title {
            width: 300px;
        }

        .boxs {
            width: 700px;
            margin-bottom: 20px;
        }


    </style>
</head>
<body>
<div class="container">
    <div class="content">
        <div class="flex-center-between">
            <div class="small-title">
                <div></div>
                <span>资料信息</span>
            </div>
        </div>
        <div class="children">
            <div class="title">
                <img class="img" src="" alt="">
                <span></span>
            </div>
            <div class="info">
                <span class="name">合同编号：</span>
                <span class="num">XS1212112311</span>
                <a href="javascript:void(0)" target="_blank" class="name down">点击下载</a>
                <span class="time">合同期限：2020-12-12</span>
            </div>
        </div>
        <div class="small-title">
            <input id="storeId" type="hidden" value="" th:value="${store.id}">
            <div></div>
            <span>联系人信息</span>
        </div>
        <div class="children">
            <div class="all flex-center">
                <div class="left">
                    <span class="red">*</span>
                    <span class="name">姓名：</span>
                </div>
                <div class="right">
                    <input type="text" disabled value="" th:value="${store.contactName}">
                </div>
            </div>
            <div class=" all flex-center">
                <div class="left">
                    <span class="red">*</span>
                    <span class="name">手机：</span>
                </div>
                <div class="right">
                    <input type="text" disabled value='13675454154' th:value="${store.contactMobile}">
                </div>
            </div>
            <div class="all flex-center">
                <div class="left">
                    <span class="red">*</span>
                    <span class="name">固定电话：</span>
                </div>
                <div class="right">
                    <input type="text" disabled value='0755-88888888' th:value="${store.supportPhone}">
                </div>
            </div>
            <div class="all flex-center">
                <div class="left">
                    <span class="red">*</span>
                    <span class="name">电子邮箱：</span>
                </div>
                <div class="right">
                    <input type="text" disabled value='pm@wljm.com' th:value="${store.contactEmail}">
                </div>
            </div>
        </div>
        <div class=" small-title">
            <div></div>
            <span>公司信息</span>
        </div>
        <div class="children">
            <div class="all flex-center">
                <div class="left">
                    <span class="red">*</span>
                    <span class="name">品牌名：</span>
                </div>
                <div class="right">
                    <input type="text" disabled value='苹果' th:value="${store.brandName}">
                </div>
            </div>
            <div class=" all flex-center">
                <div class="left">
                    <span class="red">*</span>
                    <span class="name">公司名称：</span>
                </div>
                <div class="right">
                    <input type="text" disabled value='深圳市欢乐动数码科技有限公司' th:value="${store.name}">
                </div>
            </div>
            <div class=" all flex-center">
                <div class="left">
                    <span class="red">*</span>
                    <span class="name">公司地址：</span>
                </div>
                <div class="right">
                    <input type="text" disabled value='深圳市罗湖区新闻大厦' th:value="${store.companyAddress}">
                </div>
            </div>
            <div class=" all flex-center">
                <div class="left">
                    <span class="red">*</span>
                    <span class="name">经营范围：</span>
                </div>
                <div class="right">
                    <input type="text" disabled value='电子产品' th:value="${store.businessScope}">
                </div>
            </div>
            <div class=" all flex-center">
                <div class="left">
                    <span class="red">*</span>
                    <span class="name">合作产品说明：</span>
                </div>
                <div class="right">
                    <textarea cols="30" rows="10" value="请填写公司主要产品线和优势产品，限100字" disabled
                              th:value="${store.description}"></textarea>
                </div>
            </div>
        </div>
        <div class=" small-title">
            <div></div>
            <span>资质信息</span>
        </div>
        <div class="children flex-center">
            <div class="flex-colunm">
                <div>
                    <span class="red">*</span>
                    <span class="name">营业执照号：</span>
                    <span class="name" th:text="${store.businessLicenseNo}">12112312312</span>
                </div>
                <img class=" photo"
                     src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1585048598792&di=244a9643dda400fadf176d7382a49077&imgtype=0&src=http%3A%2F%2F5b0988e595225.cdn.sohucs.com%2Fimages%2F20170901%2Fc4dac0665e1345df82aca53caffb0683.jpeg"
                     alt="" th:src="${store.supportName}">
                <div class="k-height"></div>
            </div>
            <div>
                <div class="id">
                    <span class="red">*</span>
                    <span class="name">法人身份证：</span>
                </div>
                <div class="flex-center">
                    <div class="flex-colunm front">
                        <img class="photo"
                             src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1585048598792&di=244a9643dda400fadf176d7382a49077&imgtype=0&src=http%3A%2F%2F5b0988e595225.cdn.sohucs.com%2Fimages%2F20170901%2Fc4dac0665e1345df82aca53caffb0683.jpeg"
                             alt="" th:src="${store.idCardFront}">
                        <span class="name">正面</span>
                    </div>
                    <div class="flex-colunm">
                        <img class="photo"
                             src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1585048598792&di=244a9643dda400fadf176d7382a49077&imgtype=0&src=http%3A%2F%2F5b0988e595225.cdn.sohucs.com%2Fimages%2F20170901%2Fc4dac0665e1345df82aca53caffb0683.jpeg"
                             alt="" th:src="${store.idCardReverse}">
                        <span class="name">反面</span>
                    </div>
                </div>
            </div>
        </div>

        <div class="children" th:if="${store.status} eq 2">
            <div class="name">提交时间：2019-10-20 15：00</div>
            <div class="button flex-center">
                <button class="closed" onclick="checkStart()">审核通过</button>
                <button class="refresh" onclick="showCheckModal()">审核不通过</button>
            </div>
        </div>
        <div class="children">
            <div class="boxs">提交时间：2019-10-20 15：00</div>
            <div class="flex-center boxs">
                <div class="info-title">审核状态：审核通过</div>
                <div><span>审核状态：审核不通过</span><span>备注：企业营业执照不清晰</span></div>
            </div>
            <div class="flex-center boxs">
                <div class="info-title">审核时间：2019-10-21 15：00</div>
                <div>审核时间：2019-10-21 15：00</div>
            </div>
        </div>
    </div>

    <!-- 模态框（Modal） -->
    <!--<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">-->
    <!--<div class="modal-dialog">-->
    <!--<div class="modal-content">-->
    <!--<div class="modal-header">-->
    <!--<button type="button" class="close" data-dismiss="modal" aria-hidden="true">-->
    <!--&times;-->
    <!--</button>-->
    <!--<h4 class="modal-title" id="myModalLabel">-->
    <!--审核-->
    <!--</h4>-->
    <!--</div>-->
    <!--<div class="modal-body">-->
    <!--审核信息: <input id="content" type="text">-->
    <!--</div>-->
    <!--<div class="modal-footer">-->
    <!--<button type="button" class="btn btn-default" data-dismiss="modal">关闭-->
    <!--</button>-->
    <!--<button type="button" class="btn btn-primary" onclick="checkRows()">-->
    <!--提交更改-->
    <!--</button>-->
    <!--</div>-->
    <!--</div>&lt;!&ndash; /.modal-content &ndash;&gt;-->
    <!--</div>&lt;!&ndash; /.modal &ndash;&gt;-->
    <!--</div>-->

    <div class="modal inmodal" id="myModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" onclick="closeCheckModal()">
                        <span aria-hidden="true">&times;</span><span class="sr-only">关闭</span>
                    </button>
                    <h4 class="modal-title">审核</h4>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">审核信息：</label>
                            <div class="col-sm-9">
                                <input id="content" class="form-control" type="text">
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-white" data-dismiss="modal" onclick="closeCheckModal()">取消
                    </button>
                    <button type="button" class="btn btn-primary" onclick="checkRows()">提交更改</button>
                </div>
            </div>
        </div>
    </div>
</div>
<th:block th:include="include :: footer"/>
<script th:inline="javascript">
    var editFlag = [[${@permission.hasPermi('mall:store:edit')}]];
    var removeFlag = [[${@permission.hasPermi('mall:store:remove')}]];
    var prefix = ctx + "mall/check";


    function checkStart() {
        var id = $("#storeId").val();
        $.operate.post(prefix + "/approval", {"id": id});
    }

    function checkRows() {
        var id = $("#storeId").val();
        var content = $("#content").val();
        $.operate.post(prefix + "/checkRows", {"id": id, "content": content});
        $("#myModal").hide();
    }

    /**
     * 显示modal框
     */
    function showCheckModal() {
        $("#myModal").show();
    }

    /**
     * 隐藏modal框
     */
    function closeCheckModal() {
        $("#myModal").hide();
    }


</script>


</body>
</html>
